
<template>
  <div>
    <div id="qrContent" style="height: 400px;padding-top: 400px; padding-left:300px;display:none;">
      <div id="qrcode" style="position:relative;float:left;width:200px;height:120px"></div>
      <div id="qrCodeString" style="position:absolute;float:left;width:100%;height:120px;">
        <h1 style="text-align: center;font-size: 20px;height:35px;">上海汽车变速器有限公司</h1>
        <h2 style="text-align: center;font-size: 18px;height:35px;color:red">质保部热处理工厂实验室</h2>
        <h3 style="text-align: center;font-size: 16px;height:35px;letter-spacing:8px">检测任务单</h3>
        <h4 style="text-align: right;font-size: 12px;font-weight:normal;">任务单编号：{{date.taskNo}}</h4>
      </div>
      <div id="qrTable">
        <table
          border="1"
          align="center"
          style="text-align: center;width:100%; height:500px;font-size: 14px; border-collapse: collapse;"
        >
          <tr>
            <td>任务类型</td>
            <td>{{applyTypeStr}}</td>
            <td>委托日期</td>
            <td>{{date.applyTime}}</td>
          </tr>
          <tr>
            <td>委托单位/部门</td>
            <td>{{applyOrg}}</td>
            <td>委托人</td>
            <td>{{applyUser}}</td>
          </tr>
          <tr>
            <td>热处理炉号</td>
            <td>{{date.heatingNumber}}</td>
            <td>样品数量</td>
            <td>{{date.quantity}}</td>
          </tr>
          <tr>
            <td>项目号</td>
            <td>{{date.projectNo}}</td>
            <td>零件号</td>
            <td>{{date.partNumber}}</td>
          </tr>
          <tr>
            <td>零件名称</td>
            <td>{{date.partName}}</td>
            <td>零件图号</td>
            <td>{{date.partGraphNumber}}</td>
          </tr>
          <tr>
            <td>样品状态/阶段</td>
            <td>{{this.sampleStatusName}}</td>
            <td>图纸版本号</td>
            <td></td>
          </tr>
          <tr>
            <td>报验批次信息</td>
            <td></td>
            <td>装炉数量</td>
            <td>{{date.totalPartNo}}</td>
          </tr>
          <tr>
            <td>材料牌号</td>
            <td>{{date.materialNo}}</td>
            <td>原材料炉号</td>
            <td>{{date.materialFurnanceNumber}}</td>
          </tr>
          <tr>
            <td>备注</td>
            <td colspan="3">{{date.remark}}</td>
          </tr>
        </table>
      </div>
    </div>
  </div>
</template>
<style type="text/css">
td {
  text-align: center; /*水平居中*/
  vertical-align: middle; /*垂直居中*/
  width: 25%;
}
</style>
<script>
import {
  getSampleStatusDrop
} from "service/task";
 import {
    APPLY_TYPE_LIST
} from '../../../service/constant'
import {
    getLableFromList
  } from '../../../utils/common'
import QRCode from "qrcodejs2";
import $ from "jquery";
export default {
  data() {
    return {
      sampleStatusName:"",
      msg: "hello vue",
      qrCodeString: "",
      date: {},
      applyOrg: "",
      applyUser: "",
      selectRow: [],
      objectArray: [],
      applyTypeStr: '',
      count: 0,
      printCount: 0
    };
  },
  methods: {
    clear() {
      this.qrCodeString = "";
    },
    qrcode(row) {
      $("#qrcode").empty();
      let qrcode = new QRCode("qrcode", {
        width: 100,
        height: 100, // 高度
        text: row.taskNo // 二维码内容
      });
      this.date = row;
      getSampleStatusDrop().then(res2 => {
        for(let i=0; i<res2.data.result.length;i++){
            if(this.date.sampleStatus==res2.data.result[i].code){
              this.sampleStatusName=res2.data.result[i].name;
            }
        }
      });
      this.applyOrg = row.applyOrg.name;
      this.applyUser = row.applyUser.name;
      this.applyTypeStr = getLableFromList(APPLY_TYPE_LIST, this.date.taskType);
    },
    
    afterPrint() {
      this.printCount++;
      if(this.objectArray.length == this.printCount) {
        setTimeout(() => {
            window.location.reload(true);
        }, 2000);
      }
    },

    print(selectRow) {
      this.selectRow = selectRow;
      this.commonCode(selectRow[0]);
    },

    commonCode(row) {
      this.qrcode(row);
      setTimeout(() => {
        this.remove_ie_header_and_footer();
        let newstr = $("#qrContent").html();
        this.objectArray.push(newstr);
        this.count++;
        if (this.selectRow.length > this.count) {
          this.commonCode(this.selectRow[this.count]);
        } else {
          for (let m = 0; m < this.objectArray.length; m++) {
            document.body.innerHTML = this.objectArray[m];
            window.print();
            window.afterPrint = this.afterPrint();
          }
        }
      }, 1000);
    },
    remove_ie_header_and_footer() {
      let hkey_path;
      hkey_path = "HKEY_CURRENT_USER\\Software\\Microsoft\\Internet Explorer\\PageSetup\\";
      try {
      let RegWsh = new ActiveXObject("WScript.Shell");
      RegWsh.RegWrite(hkey_path + "header", "");
      RegWsh.RegWrite(hkey_path + "footer", "");
      } catch (e) {
      }
  },
     
  }
};
</script>
<style media="print">
  @page  {
     size: auto;  
     margin: 0mm; 
}
</style>